<?php @session_start(); ?>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <meta name="description" content="">
        <meta name="keywords" content="">
        <meta name="author" content="">
        <title>Checkout</title>
        <?php fnGetMeta(); ?>
        <link rel="stylesheet" type="text/css" href="<?php echo TEMPLATE; ?>css/payment.css" />
        <style>
            .error_class{
                background: none repeat scroll 0 0 #f6f6f6 !important; 
                border: 2px solid red !important;
                border-radius: 3px !important;
                color: #454444 !important;
                float: left !important;
                font-family: "Raleway",sans-serif !important;
                font-weight: 400 !important;
                margin-bottom: 3%;
                outline: medium none;
                vertical-align: top;
            }

            .socialNetwork li a{ padding-top: 10px;}    
            #siteSealFauxBadge
            {
                float:left;
            }
            #sitelock_shield_logo
            {
                float:left;
            }
        </style>
       <!-- <script>
        $(document).ready(function(){
            $("#payment_optn").change(function() {
                
                var payment_optn_name = $(this).val();
               
                if(payment_optn_name == 'Paypalpro'){
                    $("#panel").show();
                }else{
                    $("#panel").hide();
                }

            });
        });    
        

                             $('#btnSubmit').click(function() {

                                 if ($('#chkTerms').prop('checked')) {
                                     if ($('#paypalradio').is(':checked')) {
                                         $("#paypalSubmit").click()
                                     }
                                     else if ($('#creditCard').is(':checked')) {

                                         $("#authorised").click()
                                     }
                                     else
                                     {
                                         alert('Please select payment option.');
                                     }
                                 }
                                 else
                                 {
                                     alert('You must have to agree with our terms and condition before proceeding.');
                                 }

                             });


                    </script>-->

    </head>
    <body class="activateAppearAnimation header3" style="padding-top:0px;">
        <!-- Primary Page Layout 
                ================================================== --> 
        <!-- globalWrapper -->
        <div id="globalWrapper" class="localscroll">
            <?php fnGetHeader(); ?>


            <section class="inner_banner">
                <div class="container">
                    <div class="row">
                        <div class="col-sm-6">

                            <ul id="navTrail">
                                <li><a href="<?php echo URL; ?>">Home</a></li>
                                <li id="navTrailLast">Checkout</li>
                            </ul>
                        </div>
                        <div class="col-sm-6 hidden-xs"></div>
                    </div>
                </div>
            </section>
            <section class="titles">
                <div class="container">
                    <h2><span>Get 24/7 Trusted PC Solution</span> Online from Trained Tech Experts through Secure Remote Access at TechOak</h2>
                </div>
            </section>





            <div class="container_full">
                <div class="container">
                   
                        <section class="middle_section inside_innermiddle_page clearfix">
                            <section class="">
                                <section class="inner_call_for_support payment_page">

                                    <div class="payment_info">
                                        <div class="left_section" style="min-height: 280px;">
                                            <br/>  
                                           <input type="hidden" name="errorcount" id="errorcount" value="<?php echo $this->securityerror; ?>"/>
                                             <?php
                                            if (count($this->ErrorMessage) > 0):
                                                foreach ($this->ErrorMessage as $key => $value):
                                                    ?>
                                                    <div id="msg" class="alert alert-danger" style="opacity: 0.846072;">
                                                        <button data-dismiss="alert" class="close" type="button">×</button>
                                                        <i class="fa fa-ok-sign"></i> <?php echo $value; ?>
                                                    </div>
                                                    <?php
                                                endforeach;
                                            endif;
                                            ?>                                                                                                                                      <br/>               

                                            <!--Personal Information will be hide after enable to Payment section -->
                                            <fieldset >
                                                <form action="" method="post" name="chkout_form" id="chkout_form">
 <div id="information1" class="c_info">
                                                    <div id='step_1' >
                                                        <div class="frm-ord">
                                                            <label>Salutation <span class="star">*</span></label> <select name="salutation" id="drpSalutation" class="exp_section1" required>
                                                                <option selected="selected" value="">---Select---</option>
                                                                <option value="Mr"
                                                                <?php
                                                                if ($this->salutation == 'Mr'):
                                                                    echo 'selected';
                                                                endif;
                                                                ?>
                                                                        >Mr.</option>
                                                                <option value="Sir" <?php
                                                                if ($this->salutation == 'Sir'):
                                                                    echo 'selected';
                                                                endif;
                                                                ?>>Sir</option>
                                                                <option value="Mrs" <?php
                                                                if ($this->salutation == 'Mrs'):
                                                                    echo 'selected';
                                                                endif;
                                                                ?>>Mrs.</option>
                                                                <option value="Miss" <?php
                                                                if ($this->salutation == 'Miss'):
                                                                    echo 'selected';
                                                                endif;
                                                                ?>>Miss</option>
                                                                <option value="Ms" <?php
                                                                if ($this->salutation == 'Ms'):
                                                                    echo 'selected';
                                                                endif;
                                                                ?>>Ms.</option>
                                                                <option value="Dr" <?php
                                                                if ($this->salutation == 'Dr'):
                                                                    echo 'selected';
                                                                endif;
                                                                ?>>Dr.</option>

                                                            </select>
                                                        </div>

                                                        <div class="frm-ord">
                                                            <label>First Name<span class="star">*</span></label>
                                                            <input  value ="<?php echo $this->fname; ?>" name="fname" type="text" maxlength="50" id="txtFirstname" size="19" required class="odr-text"/>
                                                        </div>

                                                        <div class="frm-ord">
                                                            <label>Last Name<span class="star">*</span></label>
                                                            <input value ="<?php echo $this->lname; ?>" name="lname" type="text" maxlength="50" id="txtLastname" size="19" required class="odr-text"/>
                                                        </div>

                                                        <div class="frm-ord">
                                                            <label>Email Address<span class="star">*</span></label>
                                                            <input value ="<?php echo $this->email; ?>" name="email" type="email" maxlength="100" id="txtEmail" required class="odr-text"/>
                                                        </div>

                                                        <div class="frm-ord">
                                                            <label>Agent</label>

                                                            <input value ="<?php echo $this->ag_name; ?>" name="ag_name" type="text" maxlength="100" id="ag_name"  class="odr-text"/>
                <!--<select name="ag_name" id="" class="exp_section1" required style="width:50%;">
                <option value="">Select Agent</option>
                                                            <?php foreach ($this->agentArray as $agent_key => $agent_value): ?>
                                <option value="<?php echo $agent_value['ag_id'] ?>"><?php echo $agent_value['ag_name']; ?></option>
                                                            <?php endforeach; ?>
                </select>-->
                                                        </div>


                                                        <div class="frm-ord">
                                                            <label>Address<span class="star">*</span></label> <input value ="<?php echo $this->address; ?>" name="address" type="text" maxlength="150" id="txtAddress" required class="odr-text"/>
                                                        </div>
                                                        <div class="frm-ord">
                                                            <label>City<span class="star">*</span></label> <input name="city" value ="<?php echo $this->city; ?>" type="text" maxlength="150" id="txtcity" required class="odr-text"/>
                                                        </div>
                                                        <div class="frm-ord">
                                                            <label>State<span class="star">*</span></label> <input  value ="<?php echo $this->state; ?>" name="state" type="text" maxlength="150" id="txtstate" required class="odr-text"/>
                                                        </div>
                                                        <div class="frm-ord">
                                                            <label>Zip Code<span class="star">*</span> </label>
                                                            <input value ="<?php echo $this->zipcode; ?>" name="zipcode" type="text" maxlength="10" id="txtZipcode" required class="odr-text"/>
                                                        </div>
                                                        <div class="frm-ord">
                                                            <label>Country <span class="star">*</span></label>
 <select name="country" id="txtcountry" class="exp_section1"  style="width:50%;">
                                                                <?php foreach($this->countryArray as $key =>$value): 
                                                                    if($this->country == $key){
                                                                        $selected = 'selected';
                                                                    }else{
                                                                        $selected = '';
                                                                    }
                                                                    ?>
                                                                <option <?php echo $selected; ?> value="<?php echo $key?>"><?php echo $value;?></option>
                                                                <?php endforeach; ?>
                                                                </select>                                                  
												  </div>
                                                        <div class=" frm-ord">
                                                            <label>Phone No<span class="star">*</span></label>  <input value ="<?php echo $this->phone; ?>" name="phone" type="text" maxlength="" id="txtPhone1" class="phone_no odr-text" />
                                                        </div>

                                                    </div>
                                                    <div id='step_2' style="display:none">
                                                        <input value ="" name="scrollup" type="text" maxlength="" id="scrollup" class="phone_no odr-text" style="display: none" />

                                                        <div class="frm-ord">
                                                            <label>Payment Option <span class="star">*</span></label>
                                                            <input type="radio" class="paymentoption" name="drpgateway" <?php if ($this->drpgateway == 'Paypal'): echo "checked";
                                                            endif; ?> value="Paypal" id="paypalradio" ><img src="<?php echo TEMPLATE; ?>images/paypal.png" style="margin-left:10px;"><br/>
                                                            <input type="radio"  class="paymentoption" name="drpgateway" <?php if ($this->drpgateway == 'credit_card'): echo "checked";
                                                            endif; ?> value="credit_card"  id="creditCard"><img src="<?php echo TEMPLATE; ?>images/creditcards.png" style="margin-left:10px;">
                                                            <br/><br/>
                                                        </div>

                                                        <div style="display: <?php if ($this->drpgateway == 'credit_card'): echo "block";
                                                            else: echo "none";
                                                            endif; ?>" id="panel">

                                                            <div class="frm-ord" id="miji_stores">
                                                                <label>Processor <span class="star">*</span></label>
                                                              
                                                                <select name="payment_optn" id="payment_optn" class="exp_section1" >
<?php foreach ($this->paymentstore as $_key => $_value): ?>
                                                                <option value="<?php echo $_value['key']; ?>"> <?php echo $_value['name']; ?></option>
<?php endforeach; ?>

                                                                   
                                                                    <!--<option value="">Select Method</Option>
                                                                    
                                                                    
                                                                    <option value="nmi" <?php if ($this->payment_optn == 'nmi'): echo "selected";
                                                            endif; ?>>NMI</option>
                                                                    <option value="authorize" <?php if ($this->payment_optn == 'authorize'): echo "selected";
                                                                    endif; ?>>Authorize</option>
                                                                   <option value="first-data" <?php if ($this->payment_optn == 'first-data'): echo "selected";
                                                                    endif; ?>>First Data</option>
                                                                   -->
<?php /* foreach ($this->paymentstore as $_key => $_value): ?>
  <option value=" <?php echo $_key; ?>"> <?php echo $_value; ?></option>
  <?php endforeach;
 */ ?>
                                                                </select>
                                                                <br/><br/>
                                                            </div>

 <div class="cc-container">
 <!--
                                                            <div class="frm-ord cc-ddl-contents">
                                                                <label>Credit Card Type <span class="star">*</span></label>
                                                                <select name="drpCardType" id="drpCardType" class="exp_section1 cc-ddl-type" >
                                                                    <option selected="selected" value="">---Select---</option>
                                                                    <option value="visa" <?php if ($this->drpCardType == 'visa'): echo "selected";
endif; ?>>Visa</option>
                                                                    <option value="MasterCard" <?php if ($this->drpCardType == 'MasterCard'): echo "selected";
endif; ?>>Master Card</option>
                                                                    <option value="Discover" <?php if ($this->drpCardType == 'Discover'): echo "selected";
endif; ?>>Discover</option>
                                                                    <option value="Amex" <?php if ($this->drpCardType == 'Amex'): echo "selected";
endif; ?>>American Express</option>

                                                                </select>
                                                            </div>-->
                                                            <div class="frm-ord"><label>Credit Card No.<span class="star">*</span></label>
                                                                <input name="txtCreditcardno"  value="<?php echo $this->txtCreditcardno; ?>" maxlength="16" id="txtCreditcardno"   class="odr-text cc-card-number" autocomplete="off">
                                                            </div>
                                                        </div>
                                                            <div class="frm-ord cc-ddl-contents">
                                                                <label>Expiration Date <span class="star">*</span></label>
                                                                <select name="drpExpMonth" id="drpExpMonth" class="exp_section" >
                                                                    <option selected="selected" value="">--</option>
                                                                    <?php for ($i = 1; $i <= 9; $i++) { ?>
                                                                        <option <?php if ($this->drpExpMonth == $i): echo "selected";
                                                                    endif; ?> value="<?php echo "0" . $i; ?>"><?php echo "0" . $i; ?></option>
                                                                    <?php } ?>
                                                                    <?php for ($i = 10; $i <= 12; $i++) { ?>
                                                                        <option <?php if ($this->drpExpMonth == $i): echo "selected";
                                                                        endif; ?> value="<?php echo $i; ?>"><?php echo $i; ?></option>
<?php } ?>


                                                                </select>
                                                                <select name="expyear" id="drpExpYear" class="exp_section" >
                                                                    <option selected="selected" value="">----</option>
<?php
$endyear = date('Y', strtotime('+10 year'));
for ($j = date('Y'); $j <= $endyear; $j++) {
    ?>
                                                                        <option <?php if ($this->drpExpYear == $j): echo "selected";
    endif; ?> value="<?php echo $j; ?>"><?php echo $j; ?></option>
<?php } ?>

                                                                </select>
                                                            </div>
                                                            <div class="frm-ord">
                                                                <label>Name on Card <span class="star">*</span></label>
                                                                <input name="nameoncard"  id="txtNameoncard" value="<?php echo $this->txtNameoncard; ?>" type="text" >
                                                            </div>
                                                            <div class="frm-ord">
                                                                <label>CVV <span class="star">*</span></label>
                                                                <input name="cvv"  maxlength="4" id="txtCvv" value="<?php echo $this->txtCvv; ?>" class="cvv_code" type="text" autocomplete="off" >
                                                                <span class="wh_wrap">&nbsp;</span> </div>
																
																<div class="frm-ord security_code" style="width: 90%">
<label>Security <span class="star">*</span></label>
<div class="s_wrap">
    <?php //echo $_SESSION['security_code'] ?>
    <img src="<?php echo URL; ?>captcha_code_file.php?rand=<?php echo rand(); ?>" id='captchaimg' style="margin-left: 5px; margin-bottom: 2px; height: 33px;" >
    <input class="required form-control" value="<?php echo $this->codex; ?>" id="6_letters_codex" name="codex" type="text" placeholder="Type Captcha Code" required="">
    <span class="wh_wrap">&nbsp;</span> </div>
</div>
                                                        </div>






                                                        <div class="frm-ord">
                                                            <label class="s_code no_data">&nbsp;</label>
                                                            <span style="float:left;"><input id="chkTerms" name="terms" <?php
                                                                                             if ($this->terms == 1):echo 'checked';
                                                                                             endif;
?> type="checkbox"   value="1"></span>
                                                            <span class="iagree_info">&nbsp; I agree with the <a href="<?php echo URL; ?>terms-and-conditions" target="_blank"> terms and conditions</a></span></div>
                                                    </div>

                                                </div>
                                            </form>
                                                <div class="btn_container">
                                                    <div class="btn-inner" >
                                                        <label class="s_code">&nbsp;</label>
                                                        <input type="button" class="btn btn-lg" name="continue" value="Next"  id="btnContinue" />
                                                        <input type="button" class="btn btn-lg cc-checkout" name="submit" value="Submit"  id="submit_btn" />
                                                    </div>


                                                    <div class="ssl-certi">

                                                        <img name="seal" src="<?php echo URL . VIEW ?>imgs/getseal_xl.gif" width="110" height="74" alt="Click to Verify - This site has chosen an SSL Certificate to improve Web site security">

                                                        <br />

                                                    </div>	


                                                </div>
                                        </div>
                                    </div> 

                                    <div class="right_section">
                                        <div class="b_issue">
                                            <h5>FOR BILLING ISSUES<br>
                                                OR CUSTOMER COMPLAINTS<br>
                                                <span>Call</span> <strong><?php echo HOMETEL; ?></strong></h5>
                                        </div>
                                        <div id="divDHPremium" class="price">
                                            <div class="dhs">          
                                            </div>
                                            <h5>INSTANT TECH SUPPORT</h5>
                                            <ul>
                                                <li>Remote tech support </li>
                                                <li>Unlimited access to tech experts, for a whole year </li>
                                                <li>Subscription includes PC Optimization &amp; installation of PC, printer and connected devices </li>
                                            </ul>
                                        </div>

                                        <div class="clearer"></div>
                                    </div>
                                   
                                    <div class="clearer"></div>
                                    </div>
                                </section>
                            </section>
                        </section>




                </div>







            </div>
        </div>
    </div>

          <script src="<?php echo TEMPLATE; ?>js/ccvalidate.js" type="text/javascript"></script>

    <script>

    
   
    $(document).ready(function() {
           
            
            $("#submit_btn").hide();
            $("#btnContinue").click(function() {
            
                var drpSalutation = $("#drpSalutation").val();
                var txtFirstname = $("#txtFirstname").val();
                var txtLastname = $("#txtLastname").val();
                var email = $("#email").val();
                var txtAddress = $("#txtAddress").val();
                var txtcity = $("#txtcity").val();
                var txtstate = $("#txtstate").val();
                var txtZipcode = $("#txtZipcode").val();
                var txtcountry = $("#txtcountry").val();
                var txtPhone1 = $("#txtPhone1").val();
                var regex = /^([a-zA-Z0-9_.+-])+\@(([a-zA-Z0-9-])+\.)+([a-zA-Z0-9]{2,4})+$/;
        
                $(".error_class").removeClass('error_class');
                //alert(regex.test(email));
                if(drpSalutation == ''){
                    $("#drpSalutation").addClass('error_class');
                    $("#drpSalutation").focus();
                    return false;
                }else if(txtFirstname == ''){
                    $("#txtFirstname").addClass('error_class');
                    $("#txtFirstname").focus();
                    return false;
                }else if(txtLastname == ''){
                    $("#txtLastname").addClass('error_class');
                    $("#txtLastname").focus();
                    return false;
                }else if(email == ''){
                    $("#email").addClass('error_class');
                    $("#email").focus();
                    return false;
                }/*else if(email != '' && regex.test(email) == false){
                    $("#email").addClass('error_class');
                    $("#email").focus();
                    return false;
                }*/else if(txtAddress == ''){
                    $("#txtAddress").addClass('error_class');
                    $("#txtAddress").focus();
                    return false;
                }else if(txtcity == ''){
                    $("#txtcity").addClass('error_class');
                    $("#txtcity").focus();
                    return false;
                }else if(txtstate == ''){
                    $("#txtstate").addClass('error_class');
                    $("#txtstate").focus();
                    return false;
                }else if(txtZipcode == ''){
                    $("#txtZipcode").addClass('error_class');
                    $("#txtZipcode").focus();
                    return false;
                }else if(txtcountry == ''){
                    $("#txtcountry").addClass('error_class');
                    $("#txtcountry").focus();
                    return false;
                }else if(txtPhone1 == ''){
                    $("#txtPhone1").addClass('error_class');
                    $("#txtPhone1").focus();
                    return false;
                }else{
                     $("#step_2").show();
                    $("#step_1").hide();
                    $('html, body').animate({scrollTop : 0},800);
                    $("#submit_btn").show();
                    $("#btnContinue").hide();
                }
                
                // Specify the validation rules
        
        /*     
          */  });

$("#txtCreditcardno").keypress(function (e) {
     //if the letter is not digit then display error and don't type anything
     if (e.which != 8 && e.which != 0 && (e.which < 48 || e.which > 57)) {
        //display error message
        // $("#txtCreditcardno").addClass('error_class');
         $("#txtCreditcardno").focus();
         return false;
    }
});
   
   $("#txtCvv").keypress(function (e) {
     //if the letter is not digit then display error and don't type anything
     if (e.which != 8 && e.which != 0 && (e.which < 48 || e.which > 57)) {
        //display error message
        // $("#txtCvv").addClass('error_class');
         $("#txtCvv").focus();
         return false;
    }
});

if($("#errorcount").val() == 1){
     $("#step_2").show();
    $("#step_1").hide();
  //  $('html, body').animate({scrollTop : 0},800);
    $("#submit_btn").show();
	$("#6_letters_codex").addClass('error_class');
	$("#6_letters_codex").focus();
    $("#btnContinue").hide();
}
            $("#submit_btn").click(function() {
            
                var paymentoption = $(".paymentoption").val();
                var payment_optn = $("#payment_optn").val();
                var drpCardType = $("#drpCardType").val();
                var txtCreditcardno = $("#txtCreditcardno").val();
                var drpExpMonth = $("#drpExpMonth").val();
                var drpExpYear = $("#drpExpYear").val();
                var txtNameoncard = $("#txtNameoncard").val();
                var txtCvv = $("#txtCvv").val();
                var chkTerms = $("#chkTerms").val();
                var number = /^([0-9]+)$/g;
                var today = new Date();
                var mm = today.getMonth()+1;
                var yyyy = today.getFullYear();
				
                $(".paymentoption").css('outline','');
                $("#chkTerms").css('outline','');
               
                $(".error_class").removeClass('error_class');
                //alert(regex.test(email));
                if($(".paymentoption:checked").length == '0'){
                    $(".paymentoption").addClass('error_class');
                    $(".paymentoption").css('outline','2px solid red');
                   // $(".paymentoption").focus();
                    return false;
                }else if($(".paymentoption:checked").val() == 'credit_card'){
                    if(payment_optn == ''){
                       $("#payment_optn").addClass('error_class');
                       $("#payment_optn").focus();
                       return false;
                   }/*else if(drpCardType == ''){
                       $("#drpCardType").addClass('error_class');
                       $("#drpCardType").focus();
                       return false;
                   }*/
				   else if(txtCreditcardno == ''){
                       $("#txtCreditcardno").addClass('error_class');
                       $("#txtCreditcardno").focus();
                       return false;
                   }
				   else if(txtCreditcardno != ''){
                        $('.cc-container').ccvalidate({ onvalidate: function(isValid) {
                            $(".error_class").removeClass('error_class'); 
                             if (!isValid) {
                                 $("#txtCreditcardno").addClass('error_class');
                                 $("#txtCreditcardno").focus();
                                 return false;
                             }else if(drpExpMonth == ''){
                                $("#drpExpMonth").addClass('error_class');
                                $("#drpExpMonth").focus();
                                return false;
                            }else if(drpExpYear == ''){
                                $("#drpExpYear").addClass('error_class');
                                $("#drpExpYear").focus();
                                return false;
                            }else if(drpExpMonth < mm  && yyyy == drpExpYear ){
                                $("#drpExpMonth").addClass('error_class');
                                $("#drpExpMonth").focus();
                                return false;
                            }else if(txtNameoncard == ''){
                                $("#txtNameoncard").addClass('error_class');
                                $("#txtNameoncard").focus();
                                return false;
                            }else if(txtCvv == ''){
                                $("#txtCvv").addClass('error_class');
                                $("#txtCvv").focus();
                                return false;
                            }else if(txtCvv != '' && number.test(txtCvv) == false){
                                 $("#txtCvv").addClass('error_class');
                                $("#txtCvv").focus();
                                return false;
                            }else if($("#6_letters_codex").val() == ''){
								$("#6_letters_codex").addClass('error_class');
								$("#6_letters_codex").focus();
								return false;
							}
                            else if($("#chkTerms:checked").length == 0){
                                $("#chkTerms").addClass('error_class');
                                $("#chkTerms").focus();
                                $("#chkTerms").css('outline','2px solid red');
                                return false;
                            }else{
                                $("#chkout_form").submit();
                            }
                             
                         }
                         });
                   }
                 
                }else if($("#chkTerms:checked").length == 0){
                       $("#chkTerms").addClass('error_class');
                       $("#chkTerms").focus();
                       $("#chkTerms").css('outline','2px solid red');
                       return false;
                }else{
                    $("#chkout_form").submit();
                }
                
                // Specify the validation rules
        
        /*     
          */  });


            $(".paymentoption").change(function() {
                if ($("#paypalradio").prop("checked") == true) {
                    //$('#miji_stores').hide();
                    $('#panel').hide();
                } else {
                    //  $('form').get(0).setAttribute('action', '');
                    $('#panel').show();
                }
            });
        });
    </script>
<?php fnGetHmFooter(); ?>
</body>
</html>